<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="renderer" content="webkit" />
    <meta
      name="viewport"
      content="width=device-width, viewport-fit=cover, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <meta content="telephone=no" name="format-detection" />
    <meta content="email=no" name="format-detection" />
    <title>TEST-DEMO</title>
    <script>
      // 在页面初始化的时候，一旦优先调用了 LightSDK 的方法，会触发 deviceready 事件，而这个事件只会执行一遍，会导致 new Vue({...}) 不会执行，在壳子里就会出现白屏现象
      // __LIGHT__IS_READY 在 main.js 文件里的 nativeReady() 也有使用
      document.addEventListener('deviceready', function () {
        window.__LIGHT__IS_READY = true;
      });
      // 换肤 url 地址里带有 theme=dark
      /**
       * 获取URL参数
       * @param name 需要获取的参数key
       * @return
       */
      function getLocationHrefParam(name) {
        // 构造一个含有目标参数的正则表达式对象
        var r = new RegExp('(\\?|#|&)' + name + '=([^&#]*)(&|#|$)');
        var m = window.location.href.match(r);
        if (r !== null) return decodeURIComponent(!m ? '' : m[2]);
        return null;
      }
      var theme = getLocationHrefParam('theme');
      const nightThemeArray = ['night', 'black', 'dark'];
      window.theme = nightThemeArray.includes(theme) ? 'dark' : 'default';
      document.querySelector('html').classList.add(theme === 'dark' ? 'jt-theme-dark' : 'jt-theme-light');
    </script>
    <style>
      html,
      body,
      #jt-h5-ofund {
        height: 100%;
      }
      iframe#webpack-dev-server-client-overlay {
          padding-top:50px;
        }
    </style>
  </head>
  <body>
    <noscript>
      <strong>很抱歉，如果没有启用JavaScript，此项目将无法正常运行。请启用它。</strong>
    </noscript>
    <div id="h5Demo248payuu3c0">
      <style>
        #jt-h5-ofund {
          position: absolute;
          top: 50%;
          left: 50%;
          display: flex;
          width: 100%;
          height: 100%;
          justify-content: center;
          align-items: center;
          flex-direction: column;
          -webkit-transform: translate3d(-50%, -50%, 0);
          transform: translate3d(-50%, -50%, 0);
        }
        .loading-container {
          width: 110px;
          height: 110px;
          border-radius: 8px;
          background: #333333f2;
          display: flex;
          justify-content: center;
          align-items: center;
          flex-direction: column;
        }
        .circle-container {
          position: relative;
          width: 28px;
          height: 28px;
        }

        .back-circle {
          position: absolute;
          width: 100%;
          height: 100%;
          border: 2px solid #e5e5e5;
          border-radius: 50%;
        }

        .red-dot {
          position: absolute;
          width: 7px;
          height: 7px;
          background-color: #ff333b;/* 品牌色 */
          border-radius: 50%;
          top: calc(50% - 3.5px); /* 保证红点垂直居中 */
          left: calc(50% - 3.5px); /* 保证红点水平居中 */
          animation: moveDot 1s ease-in-out infinite; /* 每秒一圈 */
        }

        /* 关键帧动画定义 */
        @keyframes moveDot {
          0% {
            -webkit-transform: rotate(135deg) translateX(13px);
            transform: rotate(135deg) translateX(13px); /* 初始位置，假设圆的半径为14px，所以是直径28px */
          }
          100% {
            -webkit-transform: rotate(495deg) translateX(13px);
            transform: rotate(495deg) translateX(13px); /* 结束位置，完成一圈旋转 */
          }    
        }
        .load-text {
          padding-top: 8px;
          color: #ffffff;
          font-size: 14px;
          text-align: center;
        }
      </style>
      <div class="app-loading">
        <div class="loading-container">
          <div class="circle-container">
            <div class="back-circle"></div>
            <div class="red-dot"></div>
          </div>
          <div class="load-text">加载中</div>
        </div>
      </div>
    </div>
    <script>
      document.write(
        unescape(
          "%3Cscript src='<%= BASE_URL %>config.local.js?_t=" +
            Math.random() +
            "' type='text/javascript'%3E%3C/script%3E"
        )
      );
    </script>
    <script>
      Object.freeze(window.LOCAL_CONFIG);
      Object.defineProperty(window, 'LOCAL_CONFIG', {
        configurable: false,
        writable: false
      });
    </script>
  </body>
</html>
